import React from "react";
import "./index.scss";

const formatCard = value => {
	if (value) {
		let arr = value.split("");
		let front = arr.slice(0, 4).join("");
		let last = arr.slice(-4).join("");
		return (
			<>
				<i>{front}</i>
				<i className="asterisk">****</i>
				<i className="asterisk">****</i>
				<i className="asterisk">****</i>
				<i className="asterisk">{last}</i>
			</>
		);
	}
};

const Card = ({ text, item, onClick, onGoSign }) => (
	<div className="item">
		<img src={item.logUrl} alt="" className="item-img" />
		<div className="item-desc" onClick={() => onClick(item)}>
			<p className="item-name">{item.bankName}</p>
			<p className="item-type">{text}</p>
			<p className="item-card">{formatCard(item.accountNoEncrypt)}</p>
		</div>
		{item.signStatus == "0" && (
			<div className="wqy" onClick={() => onGoSign(item)}>
				去签约
			</div>
		)}
	</div>
);

export default Card;
